<%@ include file="/common/taglibs.jsp"%> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US" dir="ltr">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<link rel="stylesheet" href="<c:url value="/css/shopadmin.css"/>" type="text/css" />
	</head>
	<body >
		<div class="head_content" id="headBar" ></div>
		<div class="main_content" id="main">
			<form id="add_category_form" action="gd_cat_save.html" method="post">				
				<input type="hidden" name="goodsCat.catId" value="${goodsCat.catId }" />
				<div class="tableform">
					<div class="division">
						<table cellspacing="0" cellpadding="0" border="0">
							<tbody>
								<tr>
									<th>
										<fmt:message key="gd_cat.name" />
									</th>
									<td>
										<input  class="x-input" id="cat_name" name="goodsCat.catName" value="${goodsCat.catName}" />
									</td>
								</tr>
								<tr>
									<th>
										<fmt:message key="gd_cat.father_name" />
									</th>
									<td>
										<select style="font-size: 12px;" name="goodsCat.parentId" class="x-input-select  inputstyle">
											<option value="0">
												----<fmt:message key="common.select_default" />----
											</option>
											<c:forEach var="list" items="${goodsCats}">
												<option value="${list.catId }" <c:if test="${goodsCat.parentId == list.catId}">selected="selected"</c:if>>
													<c:forEach items="${goodsCats}" begin="2" end="${list.depth}">&nbsp;&nbsp;&nbsp;</c:forEach>
													${list.catName }
												</option>
											</c:forEach>
										</select>
										<span class="notice-inline"><fmt:message key="gd_cat.top_level_info" />  </span>
									</td>
								</tr>
								<tr>
									<th>
										 <fmt:message key="gd_cat.type" />
									</th>
									<td>
										<select name="goodsCat.typeId">
											<c:forEach var="list" items="${goodsTypes}" varStatus="vs">
												<option <c:if test="${goodsCat.typeId == list.typeId}">selected="selected"</c:if> value="${list.typeId }">
													${list.name }
												</option>
											</c:forEach>
										</select>
									</td>
								</tr>
								<tr>
									<th>
										<fmt:message key="common.sort" />
									</th>
									<td>
										<input class="_x_ipt" name="goodsCat.showOrder" value="${goodsCat.showOrder }" id="cat_show_order" style="width: 50px;" />
										<span class="notice-inline"> <fmt:message key="common.sort_info" /></span>
									</td>
								</tr>
							</tbody>
						</table>
					</div>
					<div class="division">
						<table cellspacing="0" cellpadding="0" border="0">
							<tbody>
								<tr>
									<th>
										<fmt:message key="common.page_title" />
									</th>
									<td>
										<input type="text" value="${ goodsCat.catTitle}" maxlength="255" id="cat_title" style="width: 360px;" name="goodsCat.catTitle" />
									</td>
								</tr>
								<tr>
									<th>
										<fmt:message key="common.page_meta_keywords" />
									</th>
									<td>
										<input type="text" value="${goodsCat.catKeyword }" id="cat_keyword" style="width: 360px;" name="goodsCat.catKeyword" />
									</td>
								</tr>
								<tr>
									<th>
										<fmt:message key="common.page_meta_description" />
									</th>
									<td>
										<textarea maxlength="255" cols="35" style="width: 360px;" id="cat_description" rows="4" name="goodsCat.catDescription">${goodsCat.catDescription }</textarea>
									</td>
								</tr>
							</tbody>
						</table>
					</div>
				</div>
				<div class="table-action">
					<button class="btn" type="submit">
						<span><span><fmt:message key="button.save" /></span> </span>
					</button>
				</div>
			</form>
		</div>



		<div class="foot_content" id="footBar" style="font-size: 0px;"></div>
		<script type="text/javascript" src="<c:url value='/scripts/jquery-1.4.2.js'/>"></script>
		<script type="text/javascript" src="<c:url value='/scripts/jquery.validate.js'/>"></script>
		<script type="text/javascript">
	$(document).ready(function() {
		var validator = $("#add_category_form").validate( {
			errorElement : "div",
			errorClass : "x-vali-error",
			onfocusout : false,
			rules : {
				'goodsCat.catName' : "required",
				'goodsCat.catTitle' : "required",
				'goodsCat.showOrder' : {
					required : true,
					number : true
				},
				'goodsCat.catKeyword' : {
					required : true
				},
				'goodsCat.catDescription' : {
					required : true
				}
			},
			messages : {
				'goodsCat.catName' : '<fmt:message key="form_validate.required" />',	
				'goodsCat.showOrder' : '<fmt:message key="form_validate.number" />',	
				'goodsCat.catTitle' : '<fmt:message key="form_validate.required" />',	
				'goodsCat.catKeyword' : '<fmt:message key="form_validate.required" />',	
				'goodsCat.catDescription' : '<fmt:message key="form_validate.required" />'
			},
			// the errorPlacement has to take the table layout into account
			errorPlacement : function(error, element) {
				element.removeClass('x-vali-error');
				error.appendTo(element.parent());

			},
			// specifying a submitHandler prevents the default submit, good for the demo
			//submitHandler: function() {
			//	alert("submitted!");
			//},
			// set this class to error-labels to indicate valid fields
			success : function(div) {
				//label.html("&nbsp;").addClass("checked");
			//alert(div.is()+'\t'+);
			$(div).remove();
		}
		});
	});
</script>
	</body>
</html>